<template>
	<view>
		<u-navbar :border-bottom="false" title="员工资料" :title-size="36" :title-bold="true" :title-color="textColor">
		</u-navbar>
		<view class="u-p-t-30 u-p-b-50 u-m-b-20 u-text-center box-color ">
			<u-avatar :src="info.headImg" size="120"></u-avatar>
			<view class="u-font-32 u-m-t-34" style="font-weight: bold;">{{ info.realname }}</view>
		</view>
		<view>
			<u-cell-group>
				<u-cell-item v-if="info.phoneNumber" title="手机号" :value="info.phoneNumber" :arrow="false"></u-cell-item>
				<!-- <u-cell-item v-else title="手机号" :arrow="false">
					<view slot="right-icon" style="display: flex; flex-basis: 200rpx;justify-content: flex-end;">
						<input type="text" v-model="phoneNumber" placeholder="输入手机号" />
					</view>
				</u-cell-item> -->
				<view v-else class="box-padding u-flex u-row-between u-border-bottom">
					<view style="flex-basis: 200rpx;">
						<text>手机号</text>
					</view>
					<view style="flex-basis: 300rpx;">
						<input type="text" v-model="phoneNumber" placeholder="输入手机号" />
					</view>
				</view>
				<u-cell-item v-if="info.realname" title="姓名" :value="info.realname" :arrow="false"></u-cell-item>
				<u-cell-item v-if="info.idCardNo" title="身份证号" :value="hideIdCard(info.idCardNo)" :arrow="false"></u-cell-item>
				<u-cell-item title="职位" :value="info.shopPositionName" @click="actionSheetShow = true"></u-cell-item>
			</u-cell-group>
		</view>
		<set-submit-bt :text="addOrDel == 1 ? '添加' : '删除'" :bgColor="bgColor" @click="handleSubmit" />
		<u-action-sheet :list="positionList" v-model="actionSheetShow" cancel-text="添加职位" @click="choosePosition" @close="toAddPosition"></u-action-sheet>
	</view>
</template>

<script>
	import SetSubmitBt from '@/components/set-submit-bt/index.vue'
	export default {
		components: { SetSubmitBt },
		onShow() {
			this.getPositionList()
		},
		onLoad(options) {
			this.shopId = options.shopId;
			if (options.qrcode) {
				this.qrcode = options.qrcode
				this.getUserInfo()
			}
			if (options.userId) {
				this.userId = options.userId
				this.id = options.id
				this.shopPositionName = options.shopPositionName
				this.getUserInfoById()
				this.addOrDel = 2
			}
			// if (this.$store.state.shop.userCard.employeeId) {
			// 	this.addOrDel = 2
			// } else {
			// 	this.addOrDel = 1
			// }
		},
		data() {
			return {
				id: null,
				shopId:'',
				userId: null,
				shopPositionName: '',
				qrcode: '',
				addOrDel: 1, // 1 新增 2修改
				info: {},
				phoneNumber: '',
				actionSheetShow: false,
				positionList: []
			}
		},
		methods: {
			async getUserInfo() {
				const res = await this.$setHttp.get('api/Shop/QRShopEmployee', {  header:{shopId:this.shopId},params: { qRcode: this.qrcode, shopId: this.shopId } })
				this.info = res.data;
			},
			async getUserInfoById() {
				const res = await this.$setHttp.get('api/User/GetUser', {  header:{shopId:this.shopId},params: { id: this.userId } })
				this.info = res.data
				this.info.shopPositionName = this.shopPositionName
			},
			async getPositionList() {
				this.positionList = []
				const res = await this.$setHttp.get('api/Shop/PositionList', { header:{shopId:this.shopId},params: { id: this.shopId } })
				for (let i = 0; i < res.data.length; i++) {
					this.positionList.push({
						text: res.data[i].name,
						id: res.data[i].id
					})
				}
			},
			// 隐藏数字中间为*
			hideIdCard(val) {
				if (val) {
					return val.substr(0, 3) + '***********' + val.substr(14)
				} else {
					return ''
				}
			},
			// 选择 职位
			async choosePosition(index) {
				this.info.shopPositionId = this.positionList[index].id
				this.info.shopPositionName = this.positionList[index].text
				if (this.addOrDel == 2) {
					uni.showModal({
						title: '是否确定修改员工职位',
						success:() => {
							this.$setHttp.post('api/Shop/updateShopEmployee', { id: this.id, shopPositionId: this.positionList[index].id },{header:{shopId:this.shopId},})
						}
					})
				}
			},
			// 去添加职位
			toAddPosition() {
				this.$mRouter.push({ route: '/pages/purchase/shezhi/zhiwei?shopId='+this.shopId })
			},
			async handleSubmit() {
				if (this.addOrDel == 1) {
					if (!this.info.shopPositionId) {
						return this.$u.toast('请选择职位')
					}
					// 扫码添加
					if (this.qrcode) {
						const data = {
							name: this.info.nickname,
							shopId: this.shopId,
							userId: this.info.id,
							shopPositionId: this.info.shopPositionId
						}
						const res = await this.$setHttp.post('api/Shop/AddShopEmployee', data,{header:{shopId:this.shopId},})
						this.$u.toast('添加成功', 1000, 'success')
					} else {
						if (!this.$u.test.mobile(this.phoneNumber)) return this.$u.toast('请输入正确的11位手机号')
						const data = {
							shopId: this.shopId,
							phone: this.phoneNumber,
							shopPositionId: this.info.shopPositionId
						}
						const res = await this.$setHttp.post('api/Shop/AddShopEmployeeByPhone', data,{header:{shopId:this.shopId},})
						this.$u.toast('添加成功', 1000, 'success')
					}
				} else {
					const res = await this.$setHttp.delete('api/Shop/DeleteShopEmployee?id=' + this.id,{},{header:{shopId:this.shopId},})
					this.$u.toast('删除成功', 1000, 'success')
				}
				this.$mHelper.delayedJump()
			}
		}
	}
</script>

<style>
</style>
